<script setup lang="ts">
defineProps<{
  params: object
}>()
function convData(data: any) {
  const date = new Date(data)
  return date.toLocaleString()
}
</script>

<template>
  <PageMain>
    <div class="box">
      <el-card style="width: 480px;" shadow="never">
        <template #header>
          <div class="card-header">
            <span>用户信息详情 </span>
          </div>
        </template>
        <el-descriptions
          direction="vertical"
          :column="2"
          size="large"
          border
        >
          <el-descriptions-item label="用户类型">
            <span v-if="params.info.user_type === 1">
              <el-tag type=" info">
                管理员
              </el-tag>
            </span>
            <span v-else-if="params.info.user_type === 0">
              <el-tag type="warning">
                普通用户
              </el-tag>
            </span>
            <span v-else>其他用户</span>
          </el-descriptions-item>
          <el-descriptions-item label="UUID">
            {{ params.info.uuid }}
          </el-descriptions-item>

          <el-descriptions-item label="用户名">
            {{ params.info.username }}
          </el-descriptions-item>
          <el-descriptions-item label="注册时间">
            {{ convData(params.info.createTime) }}
          </el-descriptions-item>
          <el-descriptions-item label="注册邮箱">
            {{ params.info.email }}
          </el-descriptions-item>
        </el-descriptions>
      </el-card>
    </div>
  </PageMain>
</template>

<style scoped>
  .box {
    display: flex;
    align-items: center;
    justify-content: center;
  }
</style>
